<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./css/reset.css">
    <link rel="stylesheet" href="./css/common.css">
    <link rel="stylesheet" href="./css/header.css">
    <link rel="stylesheet" href="./css/banner.css">
    <link rel="stylesheet" href="./css/footer.css">
    <link rel="stylesheet" href="./css/product_list_common.css">
</head>
<body>
    <!--这是导航栏区域开始 -->
      <!-- 这是 nav的上面区域 -->
      <div class="nav_top">
        <div class="nav_top_div wrapper">
            <span class="f1">欢迎来到HOUSE家居网！</span>
            <div class="fr nav_top_div_1">
                <i ></i>
                <span>400-00-000xxx </span>
                <i ></i>
                <span> 1234567xxx@gmail.com</span>
            </div>
        </div>
 </div>
 <!-- 这是nav的下面区域 -->
 <div class="nav_bottom">
  <div class="nav_bottom_div wrapper clearfix ">
  <h1 class="f1 clearfix"><img src="./images/logo.png" alt="加载失败" class="f1"></h1>
  <ul class="clearfix">
      <li><a href="./index.html">首页</a></li>
      <li><a href="">关于我们</a></li>
      <li><a href="">产品展示</a></li>
      <li><a href="">新闻动态</a></li>
      <li><a href="">在线留言</a></li>
      <li><a href="">联系我们</a></li>
      
  </ul>
</div>

</div>
 <!-- 这是导航栏区域结束 -->
 <!-- 这是banner区域开始 -->
 <div class="banner" style="background-image:url(./images/banner5.jpg);height:310px">
    
 </div>
</div>
<!-- 这是banner区域结束 -->
<!-- 这是产品展示区域的公共组件 -->
<div class="big_border">

       
  <div class="wrapper product_display_div1">
      <span>
          首页&gt;&gt;
          <a href="#">关于我们</a>
      </span>
      
  </div>
</div>
<div class="big_border1">
<div class="wrapper product_display_div2  clearfix">
<h2 class="font_size">产品展示</h2>
<div class="product_display_div2_content1 f1">
  <ul class="product_display_div2_content1_ul1">
      <li>床上用品</li>
      <li>家居装饰</li>
      <li>居家日用</li>
      <li>家具收纳</li>
      <li>厨房收纳</li>
      <li>厨房餐饮</li>
  </ul>
  <img src="./images/02_wqpl.jpg" alt="">
</div>


<div class="product_display_div2_content3 fr " style="width: 912px;height: 620px;">
        <img src="./images/map.jpg" alt="加载失败" title="这里是我们的位置">
      <div class="border" style="height:215px;border: 1px solid #eaeaea; margin-top:35px;
      line-height:42px;color:#898d87;padding-top:20px;padding-left:20px;box-sizing: border-box;">
          <p>联系人：陈先生</p>
          <p>咨询热线：400-000-xxxx   /  (021)-1234578xxx</p>
          <p>联系邮箱：12385963xxxx@gmail.com</p>
          <p>公司地址：中国上海市xxx区xxx路12号moumou大厦5层5xx室</p>
      </div>
</div>
</div>
</div>
<!-- 这是产品展示区域公共组件的结束 -->
   <!-- 这是footer区域开始 -->

   <div class="footer" style="margin-top:100px ;"">
    <div class="wrapper  clearfix">
        <div class="footer_div1 f1">
            <P><img src="./images/logo2.jpg" alt=""></P>
            <p><i></i>
              中国上海市xxx区xxx路12号moumou大厦5层5xx室</p>
            <p><i></i>
              400-000-xxxx   /  (021)-1234578xxx
          </p>
            <p><i></i>
              12385963xxxx@gmail.com
          </p>
       </div>

        <div class="footer_div2  f1 ">
            <h2>快速链接</h2>
            <ul>
            <li class="f1">&gt;网站首页  </li>
            <li class="fr">&gt;关于我们  </li>
            <li class="f1">&gt;产品展示</li>
            <li class="fr">&gt;新闻动态</li>
            <li class="f1">&gt;在线留言 </li>
            <li class="fr">&gt;联系我们</li>
          </ul>
        </div>
        <div class="footer_div3 f1" >
            <h2>站内搜索</h2>
            <form action="#" method="GET" class="clearfix">
                <input type="text " class="f1" placeholder="请输入关键词"> <button class="f1">登录</button>
                
            </form>
            <p>关注我们<i></i><i></i></p>
        </div>
       
    </div>
    <p> Copyright &copy; 2009-2011,www.xxxxxx.com,All rights reserved  沪ICP备XXXXXX号 未经同意，不得转载</p>
</div>
  <!-- 这是footer区域结束 -->
</body>
</html>